﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
    <title>位置确认</title>
    <script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=Mk8h4HRD1DLT3wXGM6NbmObdP0rXV70D"></script>

    <link href="css/pages.css" rel="stylesheet" />
    <link href="css/Inspection.css" rel="stylesheet" />
</head>
<body>
    <div class="photobox">
        <video id="video" autoplay="" style='width:640px;height:480px'></video>
    </div>
    <input type="text" readonly value="自动获取当前坐标" />
    <button id="picture">拍 照</button>
    <button>提 交</button>
    <canvas id="canvas" width="640" height="480"></canvas>
</body>
</html>
<script type="text/javascript">
    $(function () {
        // 百度地图API功能
        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function (r) {
            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                var mk = new BMap.Marker(r.point);
                $("input[type=text]").val(r.point.lng + ',' + r.point.lat);
            }
            else {
                alert('failed' + this.getStatus());
            }
        }, { enableHighAccuracy: true });

        //h5调用
        var video = document.getElementById("video");

        var context = canvas.getContext("2d")

        var errocb = function () {

            console.log('sth wrong!');

        };
        if (navigator.getUserMedia) { // 标准的API

            navigator.getUserMedia({ "video": true }, function (stream) {

                video.src = stream;

                video.play();

            }, errocb);

        } else if (navigator.webkitGetUserMedia) { // WebKit 核心的API

            navigator.webkitGetUserMedia({ "video": true }, function (stream) {

                video.src = window.webkitURL.createObjectURL(stream);

                video.play();

            }, errocb);

        };
        document.getElementById("picture").addEventListener("click", function () {

            context.drawImage(video, 0, 0, 640, 480);

        });




        //test "+" click
        $(".photobox_a").click(function () {
            //alert("可以点击到");
            $(this).css("text-indent", "999rem");
        });

        //photoup();
    })


    // 拍照并上传

</script>